
.bottom-bar {
  width:100%;
  position: fixed;
  bottom: 0;
  display: flex;
  height: px2rem(50px);
  border-top:1px sold #b6b6b6;
  background-color:rgba(246,246,246,0.95);
  .btn-item {
    text-decoration: none;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #999;
    font-size: 11px;
    .tab-icon {
      margin-bottom:4px;
      width: px2rem(25px);
      height: px2rem(25px);
      background-size: cover;
    }
    &.active {
      color: #000
    }
    &.my {
      .tab-icon{
        background-image: url('./img/myIcon.png')
      }
    }
    &.my.active {
      .tab-icon {
        background-image: url('./img/myIconActive.png')
      }
    }
    &.home {
      .tab-icon {
        background-image: url('./img/homeIcon.png')
      }
    }
    &.home.active {
      .tab-icon {
        background-image: url('./img/homeIconActive.png')
      }
    }
    &.order {
      .tab-icon {
        background-image: url('./img/orderIcon.png')
      }
    }
    &.order.active {
      .tab-icon {
        background-image: url('./img/orderIconActive.png')
      }
    }
  }
}